<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<script src="global.js"></script>
		<title>Document</title>
		<style>
			#ren {
				position: absolute;
				left: 10px;
				top: 30px;
			}

			#rname {
				font-size: 12px;
				position: absolute;
				left: 15px;
				top: 10px;
			}
		</style>
	</head>
	<body>
		<img id="ren" src="images/ren_q_1.gif" alt="">
		<div id="rname">
			O(∩_∩)O哈哈~
		</div>
		<script>
			var ren = document.getElementById("ren");
			var rname = document.getElementById("rname");
			var ws = 6;
			var n = 1;

			var fx = 'q';

			function qh() {
				if (n % ws == 0) {
					if (getUrlName(ren.src) == "ren_" + fx + "_1.gif") {
						ren.src = "images/ren_" + fx + "_2.gif";
					} else {
						ren.src = "images/ren_" + fx + "_1.gif";
					}
					n = 1;
				}
				n++;
			}
			var x = 0;
			var y = 0;
			var ss = 5;

			function run() {

				switch (fx) {
					case 'q':
						y += ss;
						break;
					case 'h':
						y -= ss;
						break;
					case 'l':
						x -= ss;
						break;
					case 'r':
						x += ss;
						break;
				}
				if (x < 0 ) {
					x+=ss;
					fx='r';
				}
				if(x > document.body.offsetWidth-32){
					x-=ss;
					fx='l';
				}
				ren.style.left = x + "px";
				ren.style.top = y + "px";
				rname.style.left = (ren.offsetLeft) + "px";
				rname.style.top = (ren.offsetTop - 18) + "px";
			}
			var timer = null;

			function sta() {
				timer = setInterval(function() {
					run();
					qh();
				}, 33);
			}
			function jjian(){
				ss--;
				if(ss<=3){
					ss=3;
				}
				ws++;
				if(ws>=10){
					ws=10;
				}
			}
			function adds(){
				ws--;
				if(ws<=3){
					ws=3;
				}
				ss++;
				if(ss>=10){
					ss=10;
				}
			}

			document.body.onkeydown = function(e) {
				var event = e || window.event;
				switch (event.keyCode) {
					case 38:
						fx = 'h';
						break;
					case 40:
						fx = 'q';
						break;
					case 37:
						fx = 'l';
						break;
					case 39:
						fx = 'r';
						break;
					case 32:
						clearInterval(timer);
						break;
					case 13:
						sta();
						break;
					case 109:
						jjian();
						break;
					case 107:
						adds();
						break;
				}
				//上38
				//下40
				//右39
				//左40
			}
		</script>
	</body>
</html>
